<!-- toaster directive -->
<toaster-container
        toaster-options="{'position-class': 'toast-top-right', 'close-button':true}"></toaster-container>
<!-- / toaster directive -->

<style scoped>
    <!--
    .col-lg-1 {
        width: 140px;
    }

    -->
</style>

<!-- 导航条 -->
<div class="bg-white bread-crumb">
    <ul class="breadcrumb b-a m-b-n-xs lter b-b wrapper-md">
        <li><a ui-sref="main"><i class="glyphicon glyphicon-modal-window"></i> 设备管理</a></li>
        <li><a ui-sref="main.dm.dmManager.list" class="active">设备列表</a></li>
        <li class="active" ng-bind="title"></li>
    </ul>
</div>
<div ng-show="loading" class="text-center m-t-md text-lg dataWarn"><i class="fa fa-spin fa-spinner"></i> 数据加载中...</div>
<!-- 内容区域 -->
<div class="wrapper-md content">
    <div class="panel panel-default">
        <!-- 头部 -->
        <div class="panel-heading font-bold">
            <a class="btn btn-sm btn-icon btn-rounded btn-default pull-right m-t-n-xs"
                    ui-sref="main.dm.dmManager.list"><i
                    class="text-md glyphicon glyphicon-chevron-up text-muted"></i></a>
        </div>
        <!--表单-->
        <div class="panel-body">
            <form class="form-horizontal" name="house_form" id="deviceFrom" autocomplete="off">
                <div class="form-group">
                    <label for="address" class="col-lg-1 control-label text-right"><span class="text-danger wrapper-sm">*</span>设备编号：</label>
                    <div class="col-lg-4">
                        <input type="text" class="form-control" ng-model="record.deviceCode" name="deviceCode" id="address">
                    </div>
                </div>

                <div class="form-group">
                    <label for="houseName" class="col-lg-1 control-label text-right"><span class="text-danger wrapper-sm">*</span>楼栋地址：</label>
                    <div class="col-lg-4">
                        <input type="text" class="form-control"  ng-model="record.address" name="houseName" id="houseName"
                               ng-click="openDmBuilding()">
                    </div>
                </div>

                <div class="line line-dashed b-b line-lg pull-in"></div>

                <div class="form-group">
                    <label for="deviceName" class="col-lg-1 control-label text-right"><span class="text-danger wrapper-sm">*</span>设备名称：</label>
                    <div class="col-lg-4">
                        <input type="text" class="form-control" ng-model="record.deviceName" name="deviceName" id="deviceName">
                    </div>
                </div>

                <div class="form-group">
                    <label for="categoryName" class="col-lg-1 control-label text-right"><span class="text-danger wrapper-sm">*</span>类型名称：</label>
                    <div class="col-lg-4">
                        <input type="text" class="form-control" ng-model="record.categoryName" name="categoryName"
                               ng-click="openCategory()" id="categoryName" validator="required">
                    </div>
                </div>

                <div class="line line-dashed b-b line-lg pull-in"></div>
                
                <div class="form-group">
                    <label for="productName" class="col-lg-1 control-label text-right"><span class="text-danger wrapper-sm">*</span>产品名称：</label>
                    <div class="col-lg-4">
                        <span class="form-control" ng-model="record.productId" ng-hide="true" name="productId" id="productId"></span>
                        <input type="text" class="form-control" ng-model="record.productName" name="productName" id="productName"
                               ng-click="openProducts()">
                    </div>
                </div>
                
                <div class="form-group">
                    <label class="col-lg-1 control-label text-right"><span class="text-danger wrapper-sm">*</span>设备状态：</label>
                    <div class="col-lg-4">
                        <select class="form-control" ng-model="record.status" name="status">
                            <option value="1">启用</option>
                            <option value="0">停用</option>
                        </select>
                    </div>
                </div>

                <div class="line line-dashed b-b line-lg pull-in"></div>
               <div class="form-group">
                    <label class="col-lg-1 control-label text-right">是否集成视频：</label>
                    <div class="col-lg-4">
                        <select class="form-control" ng-model="record.isIntegratedVideo" name="isIntegratedVideo">
                            <option value="1">是</option>
                            <option value="0">否</option>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-lg-1 control-label text-right">开门能力集：</label>
                    <div class="col-lg-4">
                        <input type="checkbox" data-code="0" id="A0" ><label for="" class="abilityType">刷卡</label>
                        <input type="checkbox" data-code="1" id="A1" ><label for="" class="abilityType">网络</label>
                        <input type="checkbox" data-code="2" id="A2" ><label for="" class="abilityType">蓝牙</label>
                    </div>
                </div>
                <div class="line line-dashed b-b line-lg pull-in"></div>

   				<div class="form-group">
                    <label for="mac" class="col-lg-1 control-label text-right"><span class="text-danger wrapper-sm"></span>mac：</label>
                    <div class="col-lg-4">
                        <input type="text" class="form-control" ng-model="record.mac" name="mac" id="mac" validator="required">
                    </div>
                </div>
                
                <div class="line line-dashed b-b line-lg pull-in"></div>
                
                <div class="form-group" style="width: 100%">
                    <div class="col-sm-6 col-sm-offset-2 text-center"
                         style="width: 100%;margin: 0;padding: 0;text-align: center">
                        <button type="button" class="btn w-xs addNew" ng-show="reset" ng-click="resetFrom()">重置</button>
                        <button type="submit" class="btn btn-info w-xs m-l-xl addNew"
                                ng-disabled="isDisabled">保存
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- 设备产品模态框 -->
<script type="text/ng-template" id="productList.html">
    <!-- 内容区域 -->
    <div ng-hide="loading" class="wrapper-md content">
        <!-- 数据显示 -->
        <div class="wrapper-data">
            <div class="panel panel-default">
                <!-- 头部 -->
                <div class="panel-heading clearfix">

                    <div class="w-auto">
                        <form ng-submit="search()" class="form-inline">

                            <div class="form-group"style="width: 30%;">
                                <label for="productName">产品名称：</label>
                                <input type="text"
                                       class="form-control" style="width: 160px"
                                       placeholder="" ng-model="param.productName" id="productName">
                            </div>

                            <button type="submit" class="btn btn-primary new-primary"
                                    style="margin-left: 10px">查询
                            </button>

                        </form>
                    </div>
                </div>

                <!-- 数据表格 -->
                <div class="table-responsive">
                    <table class="table table-striped b-t b-light text-center">
                        <thead>
                        <tr>
                            <th>产品名称</th>
                            
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr ng-repeat="item in pageInfo.data">
                            <td class="v-middle">{{item.productName}}</td>
                           
                            <td class="v-middle">
                                <a ng-click="selectProduct(item)">选择</a>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div><!-- /.table-responsive -->

                <!-- 底部分页 -->
                <span data-ng-include=" 'src/tpl/pageInfo.html' "></span>
            </div><!-- /.panel -->
        </div><!-- /.wrapper-data -->

    </div><!-- /.wrapper-md -->
    <div class="modal-footer">
        <button class="btn btn-warning" ng-click="cancel()">取消</button>
    </div>
</script>

<!-- 楼栋模态框 -->
<script type="text/ng-template" id="dmHouseList.html">
    <!-- 内容区域 -->
    <div ng-hide="loading" class="wrapper-md content">
        <!-- 数据显示 -->
        <div class="wrapper-data">
            <div class="panel panel-default">
                <!-- 头部 -->
                <div class="panel-heading clearfix">

                    <div class="w-auto">
                        <form ng-submit="search()" class="form-inline">

                            <div class="form-group"style="width: 30%;">
                                <label for="buildingName">楼栋名称：</label>
                                <input type="text"
                                       class="form-control" style="width: 160px"
                                       placeholder="" ng-model="param.buildingName" id="buildingName">
                            </div>
                            <div class="form-group"style="width: 30%;">
                                <label for="buildingAddress">楼栋地址：</label>
                                <input type="text"
                                       class="form-control" style="width: 160px"
                                       placeholder="" ng-model="param.buildingAddress"id="buildingAddress">
                            </div>

                                <button type="submit" class="btn btn-primary new-primary"
                                        style="margin-left: 10px">查询
                                </button>

                        </form>
                    </div>
                </div>

                <!-- 数据表格 -->
                <div class="table-responsive">
                    <table class="table table-striped b-t b-light text-center">
                        <thead>
                        <tr>
                            <th>楼栋名称</th>
                            <th>楼栋地址</th>
                            <th>状态</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr ng-repeat="item in pageInfo.data">
                            <td class="v-middle">{{item.buildingname}}</td>
                            <td class="v-middle">{{item.buildingaddress}}</td>
                            <td class="v-middle">
                               <span ng-if="item.status==1" class="text-success">有效</span>
                               <span ng-if="item.status==0" class="text-danger">无效</span>
                            </td>
                            <td class="v-middle">
                                <a ng-click="selectDmBuilding(item.buildingid,item.buildingname,item.buildingaddress)">选择</a>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div><!-- /.table-responsive -->

                <!-- 底部分页 -->
                <span data-ng-include=" 'src/tpl/pageInfo.html' "></span>
            </div><!-- /.panel -->
        </div><!-- /.wrapper-data -->

    </div><!-- /.wrapper-md -->
    <div class="modal-footer">
        <button class="btn btn-warning" ng-click="cancel()">取消</button>
    </div>
</script>

<!-- 设备类型模态框 -->
<script type="text/ng-template" id="categoryList.html">
    <!-- 内容区域 -->
    <div ng-hide="loading" class="wrapper-md content">
        <!-- 数据显示 -->
        <div class="wrapper-data">
            <div class="panel panel-default">
                <!-- 头部 -->
                <div class="panel-heading clearfix">

                    <div class="w-auto">
                        <form ng-submit="search()" class="form-inline">

                            <div class="form-group">
                                <label for="categoryId">类型编码：</label>
                                <input type="text"
                                       class="form-control" style="width: 180px"
                                       id="identity"
                                       placeholder="" ng-model="param.categoryId" id="categoryId">
                            </div>
                            <div class="form-group">
                                <label for="categoryName">类型名称：</label>
                                <input type="text"
                                    class="form-control" style="width: 180px"
                                    placeholder="" ng-model="param.categoryName" id="categoryName" name="categoryName">
                            </div>

                                <button type="submit" class="btn btn-primary new-primary"
                                        style="margin-left: 10px">查询
                                </button>

                        </form>
                    </div>
                </div>

                <!-- 数据表格 -->
                <div class="table-responsive">
                    <table class="table table-striped b-t b-light text-center">
                        <thead>
                        <tr>
                            <th>类型编码</th>
                            <th>类型名称</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr ng-repeat="item in pageInfo.data">
                            <td class="v-middle">{{item.categoryId}}</td>
                            <td class="v-middle">{{item.categoryName}}</td>
                            <td class="v-middle">
                                <a ng-click="selectCategory(item.categoryId,item.categoryName)">选择</a>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div><!-- /.table-responsive -->

                <!-- 底部分页 -->
                <span data-ng-include=" 'src/tpl/pageInfo.html' "></span>
            </div><!-- /.panel -->
        </div><!-- /.wrapper-data -->

    </div><!-- /.wrapper-md -->
    <div class="modal-footer">
        <button class="btn btn-warning" ng-click="cancel()">取消</button>
    </div>
</script>

<style scoped>
.abilityType,input[type='checkbox']{
    display:inline-block;
    line-height: 38px;
}
input[type='checkbox']{
    width: 18px;
    height: 18px;
    border-radius: 50%!important;
    margin:0 10px 3px 10px;
    vertical-align: middle;
}
.modal-dialog{width: 1100px;}
.form-group {
    width: 40%;
    float: left;
}

.form-group .col-lg-2 {
    width: 25%;
}

.form-group .col-lg-4 {
    width: 65%;
}

.app-content-body .content{
    margin-top:44px;
}
</style>